import React from "react";

import { connect } from "react-redux";

import { addAction } from "./store/arithmetic/actionCreators";

const Index = (props) => {
  return (
    <div>
      <h1> home {props.counter} </h1>
      <button
        onClick={(e) => {
          props.addCounter(2);
        }}
      >
        +2
      </button>
    </div>
  );
};

const mapStateToProps = (state) => ({
  counter: state.counter,
});

const mapDispatchToProps = (dispatch) => ({
  addCounter(num) {
    dispatch(addAction(num));
  },
});

export default connect(mapStateToProps, mapDispatchToProps)(Index);
